<template>
  <el-dialog v-model="dialogVisible" title="拨打记录" width="900" :before-close="handleClose">
    <el-descriptions title="岗位信息" :column="3">
      <el-descriptions-item label="职位"> {{name_format(row.workTypes)}}</el-descriptions-item>
      <el-descriptions-item label="用户名称">{{row.realName}}</el-descriptions-item>
      <el-descriptions-item label="状态">
        <el-tag v-if="row.status==0">{{status_format(row.status)}}</el-tag>
        <el-tag type="success" v-else-if="row.status==3">{{status_format(row.status)}}</el-tag>
        <el-tag type="warning" v-else-if="row.status==2">{{status_format(row.status)}}</el-tag>
        <el-tag type="danger" v-else-if="row.status==1">{{status_format(row.status)}}</el-tag>
      </el-descriptions-item>
    </el-descriptions>

    <el-table :data="tableData.records" border stripe>
      <el-table-column type="index" />
      <el-table-column prop="realName" label="姓名" align="center" />
      <el-table-column label="性别" align="center">
        <template #default="scope">
          <el-tag>{{scope.row.sex==0?'男':"女"}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="title" label="报名状态" align="center" />
      <el-table-column prop="userPhone" label="联系电话" align="center" />
      <el-table-column prop="callNums" label="拨打次数" align="center" />
      <el-table-column prop="gmtCreate" label="操作时间" align="center" />
    </el-table>

    <pagination v-if="tableData['total']" :total="tableData['total']" v-model:page="formInline.pageNum" v-model:limit="formInline.pageSize" @pagination="getInfo" />
  </el-dialog>
</template>

<script setup lang="ts">
const { proxy } = getCurrentInstance();
let dialogVisible = ref(false);
let formInline = ref({
  jobPostId: "",
  pageNum: 1,
  pageSize: 10,
  userId: "",
});
let tableData = ref({});
let statusList = ref([
  { label: "待审核", value: 0 },
  { label: "未通过", value: 1 },
  { label: "正在招", value: 2 },
  { label: "已招满", value: 3 },
]);
let row = ref({});

let open = async (data) => {
  row.value = { ...data };
  formInline.value.jobPostId = data.id;
  formInline.value.userId = data.userId;
  await getInfo();
  dialogVisible.value = true;
};
let getInfo = async () => {
  tableData.value = await proxy.$apis.pcCallHistory(formInline.value);
};
let handleClose = () => {
  dialogVisible.value = false;
};
let status_format = (e) => {
  let index = proxy.$utils.findIndexByField(statusList.value, "value", e);
  return statusList.value[index].label;
};
let name_format = (array) => {
  let list = [];
  array.forEach((element) => {
    list.push(element.name);
  });
  return list.toString();
};
defineExpose({ open });
</script>

<style lang="scss" scoped>
.el-table {
  margin-top: 15px;
}
</style>
